@font-face {
    font-family: 'Finger Paint';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/fingerpaint/v15/0QInMXVJ-o-oRn_7dron8YW-9JzT.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

#login {
    display: flex;
    height: 100vh;

    .login-bg {
        flex: 3;
        background: url('../../assets/image/v2-e7b2dfc45a3c54890296353b117601d0_b.jpg') no-repeat;
        background-size: auto 100%;
        display: flex;
        align-items: center;
        justify-content: center;

        &>div {
            display: flex;
            flex-direction: column;
            align-items: center;

            .logo {
                width: 300px;
            }

            .lg-typeface {
                font-family: 'Finger Paint';
                margin: auto;
                font-size: 50px;
                color: #fff;
                mask: radial-gradient(circle at 0 50%,
                        #000,
                        transparent 10%,
                        transparent 0);
                -webkit-mask: radial-gradient(circle at 0 50%,
                        #000,
                        transparent 10%,
                        transparent 0);
                mask-size: 100%;
                -webkit-mask-size: 100%;
                animation: scale 5s infinite;

            }
        }

        @keyframes scale {

            50%,
            100% {
                mask-size: 2000%;
                -webkit-mask-size: 2000%;
            }
        }

    }

    .login-form-box {
        flex: 2;
        display: flex;
        justify-content: center;

        .login-form {
            width: 45%;
            padding-top: 200px;

            .logo {
                width: 100px;
                margin: 0 auto 20px;

                img {
                    width: 100%;
                }
            }

            .ant-input-affix-wrapper {
                height: 40px;
            }

            .register {
                text-align: right;
                margin: 10px 0;

                .ant-btn {
                    padding: 0;
                }
            }

            .login-btn {
                .ant-btn {
                    width: 100%;
                    height: 40px;
                    border: 1px solid #BBBCBB !important;

                    &:focus,
                    &:hover {
                        color: #000;
                    }
                }
            }

        }
    }

}